import React ,{useEffect} from 'react';
import { Button,Form,message,Modal,DatePicker,Select} from 'antd';
import db from '@/utils/localstorage';
import moment from 'moment';
import { connect} from 'umi';
import { copyClassTable } from './service';

const { RangePicker } = DatePicker;
const layout = {
    labelCol: { span: 5 },
    wrapperCol: { span: 16 },
  };
const CopySchedule = props =>{
    const { dispatch,handleCopyOk,handleCopyCancel,copyVisible,shopList } = props;
    const [form] = Form.useForm();
    useEffect(() => {
        if (dispatch) {
            dispatch({
                type: 'cubeSchedule/fetchShopList',
                payload:{
                  userId:db.get("user").userId
                }
              })
         }
       }, []);
    const _handleCopyOk = async () =>{
        let fieldsValue = await form.validateFields();
        if(fieldsValue.date){
            fieldsValue.startDate = moment(fieldsValue.date[0]).format('YYYY-MM-DD')
            fieldsValue.endDate = moment(fieldsValue.date[1]).format('YYYY-MM-DD')
            delete fieldsValue.date
        }
        if(fieldsValue.nextDate){
            fieldsValue.nextStartDate = moment(fieldsValue.nextDate[0]).format('YYYY-MM-DD')
            fieldsValue.nextEndDate = moment(fieldsValue.nextDate[1]).format('YYYY-MM-DD')
            delete fieldsValue.nextDate
        }
        const hide = message.loading('正在复制');
        try {
          let result = await copyClassTable(fieldsValue);
          hide();
          if(result.code == 0){
            message.success('复制成功，即将刷新');
            form.resetFields();
            handleCopyOk()
            return true;
          }else{
            message.success('复制失败，请重试');
            return false;
          }
        } catch (error) {
          hide();
          message.error('复制失败，请重试');
          return false;
        }
    }

    const _handleCopyCancel = () =>{
        form.resetFields();
        handleCopyCancel();
    }

    return <Modal
    title="复制课表"
    visible={copyVisible}
    onOk={_handleCopyOk}
    onCancel={_handleCopyCancel}
  >
   <Form
              {...layout}
              name="basic"
              form={form}
            >
              <Form.Item
                label="选择场馆"
                name="venueId"
                rules={[{ required: true, message: '请选择场馆' }]}
              >
                <Select style={{ width: '100%' }} placeholder="请选择" >
                    {
                        shopList&&shopList.map((item,index)=> <Select.Option value={item.id} key={index}>{item.name}</Select.Option>)
                    }
                </Select>
              </Form.Item>
              <Form.Item
                label="将"
                name="date"
                rules={[{ required: true, message: '请选择复制开始时间' }]}
              >
               <RangePicker style={{width:'100%'}}/>
              </Form.Item>
              <Form.Item
                label="复制到"
                name="nextDate"
                rules={[{ required: true, message: '请选择复制目标时间' }]}
              >
               <RangePicker style={{width:'100%'}}/>
              </Form.Item>
            </Form>
  </Modal>
}

export default connect(({ loading,cubeSchedule }) => ({
    shopList: cubeSchedule.shopList
  }))(CopySchedule);
  